<template>
  <view class="test-report">
    <view class="report-content">
      <view class="section-title"><view class="title">项目信息</view></view>
      <view class="form-box">
        <view class="form-item">
          <view class="item-name">项目名称</view>
          <view class="item-content"><input placeholder="请输入项目名称" v-model="name" /></view>
        </view>
        <view class="form-item">
          <view class="item-name">项目描述</view>
          <view class="item-content"><input placeholder="请输入项目描述" v-model="desc" maxlength="100" /></view>
        </view>
        <view class="form-item">
          <view class="item-name">项目地址</view>
          <view class="item-content">
            <input placeholder="请输入项目地址" v-model="address" maxlength="500" />
            <i class="suffix-icon location iconfont icon-location" @click="chooseProjectAddr" />
          </view>
        </view>
        <view class="form-item">
          <view class="item-name">测试位置</view>
          <view class="item-content"><input placeholder="请输入测试位置" v-model="place" maxlength="100" /></view>
        </view>
        <view class="form-item">
          <view class="item-name">项目预估灯具数量</view>
          <view class="item-content">
            <input type="number" placeholder="请输入数量" v-model="lampCount" maxlength="10" />
            <view class="suffix-unit">盏</view>
          </view>
        </view>
        <view class="form-item">
          <view class="item-name">项目性质</view>
          <view class="item-content">
            <uni-data-select class="input" :clear="false" v-model="currProjectType" :localdata="projectTypeList" placeholder="请选择项目性质"></uni-data-select>
          </view>
        </view>
        <view class="form-item">
          <view class="item-name">标准电价</view>
          <view class="item-content">
            <input type="digit" placeholder="请输入标准电价" v-model="powerPrice" maxlength="10" />
            <view class="suffix-unit power">元/度</view>
          </view>
        </view>
        <view class="form-item">
          <view class="item-name">安装时间</view>
          <view class="item-content"><uni-datetime-picker class="input" type="datetime" v-model="installTime" :clear-icon="false" :hide-second="true" /></view>
        </view>
        <view class="form-item">
          <view class="item-name">原灯具类型</view>
          <view class="item-content"><input placeholder="请输入原灯具类型" v-model="prevLampType" maxlength="100" /></view>
        </view>
        <view class="form-item">
          <view class="item-name">原灯具描述</view>
          <view class="item-content"><input placeholder="请输入原灯具描述" v-model="prevLampDesc" maxlength="200" /></view>
        </view>
        <view class="form-item">
          <view class="item-name">原灯具数量</view>
          <view class="item-content">
            <input type="number" placeholder="请输入数量" v-model="prevLampCount" maxlength="10" />
            <view class="suffix-unit">盏</view>
          </view>
        </view>
        <view class="form-item">
          <view class="item-name">测试灯具类型</view>
          <view class="item-content">
            <uni-data-select class="input" :clear="false" v-model="currTestLampType" :localdata="lampTypeList" placeholder="请选择灯具类型"></uni-data-select>
          </view>
        </view>
        <view class="form-item">
          <view class="item-name">测试灯具数量</view>
          <view class="item-content">
            <input type="number" placeholder="请输入数量" v-model="testLampCount" maxlength="10" />
            <view class="suffix-unit">盏</view>
          </view>
        </view>
        <view class="form-item">
          <view class="item-name">测试机构/公司</view>
          <view class="item-content"><input placeholder="请输入测试机构/公司" v-model="testOrgName" maxlength="200" /></view>
        </view>
        <view class="memo-box">
          <view class="item-name">备注</view>
          <view class="memo-content"><textarea class="memo" placeholder="请输入备注信息" maxlength="1000" auto-height v-model="memo" @change="updateMemo"></textarea></view>
        </view>
      </view>
      <view class="section-title power"><view class="title">现场照片</view></view>
      <view class="record-box">
        <view class="record-item">
          <view class="picture-box">
            <view class="type-item">
              <view class="picture-item">
                <view class="picture-name">原始灯具现场照片</view>
                <view class="picture-value"><uni-easyinput trim="all" :clearable="false" maxlength="10" v-model="prevLiveDesc" placeholder="请输入描述"></uni-easyinput></view>
                <view class="file-box">
                  <view v-if="!prevLivePic" class="add-file" @click="chooseFile(PHOTO_TYPE.PREV_LIVE)"><view class="iconfont icon-add"></view></view>
                  <view v-else class="file-preview-box">
                    <view class="delete-file" @click="clearFile(PHOTO_TYPE.PREV_LIVE)"><view class="iconfont icon-close"></view></view>
                    <image class="file-preview" :src="prevLivePic" mode="aspectFill" @click="previewImg(PHOTO_TYPE.PREV_LIVE)"></image>
                  </view>
                </view>
              </view>
            </view>
            <view class="type-item">
              <view class="picture-item">
                <view class="picture-name">灯具现场照片</view>
                <view class="picture-value"><uni-easyinput trim="all" :clearable="false" maxlength="10" v-model="testLiveDesc" placeholder="请输入描述"></uni-easyinput></view>
                <view class="file-box">
                  <view v-if="!testLivePic" class="add-file" @click="chooseFile(PHOTO_TYPE.TEST_LIVE)"><view class="iconfont icon-add"></view></view>
                  <view v-else class="file-preview-box">
                    <view class="delete-file" @click="clearFile(PHOTO_TYPE.TEST_LIVE)"><view class="iconfont icon-close"></view></view>
                    <image class="file-preview" :src="testLivePic" mode="aspectFill" @click="previewImg(PHOTO_TYPE.TEST_LIVE)"></image>
                  </view>
                </view>
              </view>
            </view>
          </view>
        </view>
      </view>
      <view class="section-title power"><view class="title">能耗值</view></view>
      <view class="record-box">
        <view class="record-item">
          <view class="time-box">
            <view class="item-name">开始时间</view>
            <view class="item-content"><uni-datetime-picker type="datetime" v-model="startTime" :clear-icon="false" :hide-second="true" /></view>
          </view>
          <view class="picture-box">
            <view class="type-item">
              <view class="picture-item">
                <view class="picture-name">原始灯具能耗值</view>
                <view class="picture-value align-right">
                  <uni-easyinput trim="all" type="digit" :clearable="false" maxlength="10" v-model="startPrevLampKWH" placeholder="请输入"></uni-easyinput>
                  <view class="picture-value-unit">Kwh</view>
                </view>
                <view class="file-box">
                  <view v-if="!startPrevPowerPic" class="add-file" @click="chooseFile(PHOTO_TYPE.STSRT_PREV_POWER)"><view class="iconfont icon-add"></view></view>
                  <view v-else class="file-preview-box">
                    <view class="delete-file" @click="clearFile(PHOTO_TYPE.STSRT_PREV_POWER)"><view class="iconfont icon-close"></view></view>
                    <image class="file-preview" :src="startPrevPowerPic" mode="aspectFill" @click="previewImg(PHOTO_TYPE.STSRT_PREV_POWER)"></image>
                  </view>
                </view>
              </view>
            </view>

            <view class="type-item">
              <view class="picture-item">
                <view class="picture-name">灯具能耗值</view>
                <view class="picture-value align-right">
                  <uni-easyinput trim="all" type="digit" :clearable="false" maxlength="10" v-model="startTestLampKWH" placeholder="请输入"></uni-easyinput>
                  <view class="picture-value-unit">Kwh</view>
                </view>
                <view class="file-box">
                  <view v-if="!startTestPowerPic" class="add-file" @click="chooseFile(PHOTO_TYPE.STSRT_TEST_POWER)"><view class="iconfont icon-add"></view></view>
                  <view v-else class="file-preview-box">
                    <view class="delete-file" @click="clearFile(PHOTO_TYPE.STSRT_TEST_POWER)"><view class="iconfont icon-close"></view></view>
                    <image class="file-preview" :src="startTestPowerPic" mode="aspectFill" @click="previewImg(PHOTO_TYPE.STSRT_TEST_POWER)"></image>
                  </view>
                </view>
              </view>
            </view>
          </view>
        </view>

        <view class="record-item">
          <view class="time-box">
            <view class="item-name">结束时间</view>
            <view class="item-content"><uni-datetime-picker type="datetime" v-model="endTime" :clear-icon="false" :hide-second="true" /></view>
          </view>
          <view class="picture-box">
            <view class="type-item">
              <view class="picture-item">
                <view class="picture-name">原始灯具能耗值</view>
                <view class="picture-value align-right">
                  <uni-easyinput trim="all" type="digit" :clearable="false" maxlength="10" v-model="endPrevLampKWH" placeholder="请输入"></uni-easyinput>
                  <view class="picture-value-unit">Kwh</view>
                </view>
                <view class="file-box">
                  <view v-if="!endPrevPowerPic" class="add-file" @click="chooseFile(PHOTO_TYPE.END_PREV_POWER)"><view class="iconfont icon-add"></view></view>
                  <view v-else class="file-preview-box">
                    <view class="delete-file" @click="clearFile(PHOTO_TYPE.END_PREV_POWER)"><view class="iconfont icon-close"></view></view>
                    <image class="file-preview" :src="endPrevPowerPic" mode="aspectFill" @click="previewImg(PHOTO_TYPE.END_PREV_POWER)"></image>
                  </view>
                </view>
              </view>
            </view>

            <view class="type-item">
              <view class="picture-item">
                <view class="picture-name">灯具能耗值</view>
                <view class="picture-value align-right">
                  <uni-easyinput trim="all" type="digit" :clearable="false" maxlength="10" v-model="endTestLampKWH" placeholder="请输入"></uni-easyinput>
                  <view class="picture-value-unit">Kwh</view>
                </view>
                <view class="file-box">
                  <view v-if="!endTestPowerPic" class="add-file" @click="chooseFile(PHOTO_TYPE.END_TEST_POWER)"><view class="iconfont icon-add"></view></view>
                  <view v-else class="file-preview-box">
                    <view class="delete-file" @click="clearFile(PHOTO_TYPE.END_TEST_POWER)"><view class="iconfont icon-close"></view></view>
                    <image class="file-preview" :src="endTestPowerPic" mode="aspectFill" @click="previewImg(PHOTO_TYPE.END_TEST_POWER)"></image>
                  </view>
                </view>
              </view>
            </view>
          </view>
        </view>
      </view>
      <view class="btn-box"><view class="btn-item primary" @click="saveReport()">保存</view></view>
    </view>
    <view v-if="isShowResult" class="split-symbol">
      <view class="split-item">
        <view class="split-dot"></view>
        <view class="split-line"></view>
        <view class="split-dot"></view>
      </view>
      <view class="split-item">
        <view class="split-dot"></view>
        <view class="split-line"></view>
        <view class="split-dot"></view>
      </view>
    </view>
    <view v-if="isShowResult" class="report-result">
      <view class="chart-box">
        <qiun-data-charts type="arcbar" :opts="chartOptions" :chartData="chartData" />
        <view class="info-text">
          <view class="info-title">测试时长：</view>
          <view class="test-duration">{{ testDuration }}</view>
        </view>
      </view>
      <view class="result-box">
        <view class="result-item">
          <view class="result-title">原有灯具功耗</view>
          <view class="result-value">
            <view class="value">{{ prevLampKWH }}</view>
            Kwh
          </view>
        </view>
        <view class="result-item">
          <view class="result-title">灯具功耗</view>
          <view class="result-value">
            <view class="value">{{ testLampKWH }}</view>
            Kwh
          </view>
        </view>
        <view class="result-item">
          <view class="result-title">单灯年度节约费用</view>
          <view class="result-value">
            <view class="value">{{ annualSingleSavingMoney }}</view>元
          </view>
        </view>
        <view class="result-item">
          <view class="result-title">总计年度节约费用</view>
          <view class="result-value">
            <view class="value">{{ annualTotalSavingMoney }}</view>元
          </view>
        </view>
      </view>
      <view class="btn-box">
        <view class="btn-item primary">导出PDF</view>
        <view class="btn-item success">分享</view>
      </view>
    </view>
    <view v-if="projectId" class="delete-project" @click="deleteProject()">删除</view>
    <uni-popup ref="deleteProjectDialog" type="dialog">
      <uni-popup-dialog type="error" cancelText="否" confirmText="是" content="确定要删除项目？" @confirm="doDelete()"></uni-popup-dialog>
    </uni-popup>
  </view>
</template>

<script>
import mixin from '@/mixins/index.js'
import { CONFIG } from '@/envs/_/config'
import { formatDate, fixedDecimal, getImagePath, getDateDiff, getAnnualNumber } from '@/utils/index.js'
import color from '@/envs/_/variables.scss'
const chooseLocation = requirePlugin('chooseLocation')
export default {
  mixins: [mixin],
  data() {
    return {
      isShowResult: false,
      projectId: '',
      name: '',
      desc: '',
      currLocation: null,
      address: '',
      place: '',
      lampCount: '',
      currProjectType: '',
      powerPrice: '',
      installTime: '',
      currTestLampType: '',
      prevLampDesc: '',
      prevLampType: '',
      prevLampCount: '',
      testLampType: '',
      testLampCount: '',
      testOrgName: '',
      memo: '',
      prevLivePic: '',
      testLivePic: '',
      prevLiveDesc: '',
      testLiveDesc: '',
      prevLivePath: '',
      testLivePath: '',
      startTime: '',
      startPrevLampKWH: '',
      startTestLampKWH: '',
      startPrevPowerPic: '',
      startTestPowerPic: '',
      startPrevPowerPath: '',
      startTestPowerPath: '',
      endTime: '',
      endPrevLampKWH: '',
      endTestLampKWH: '',
      endPrevPowerPic: '',
      endTestPowerPic: '',
      endPrevLiveDesc: '',
      endTestLiveDesc: '',
      endPrevLivePic: '',
      endTestLivePic: '',
      endPrevPowerPath: '',
      endTestPowerPath: '',
      savingRate: '',
      testDuration: '',
      prevLampKWH: '',
      testLampKWH: '',
      annualSingleSavingMoney: '',
      annualTotalSavingMoney: '',
      chartOptions: {
        color: [color.primary],
        padding: undefined,
        title: {
          name: '80%',
          fontSize: 30,
          color: color.textMain
        },
        subtitle: {
          name: '预计节能率',
          fontSize: 12,
          color: color.textMain
        },
        extra: {
          arcbar: {
            type: 'default',
            width: 12,
            backgroundColor: color.primaryLighter,
            startAngle: 0.75,
            endAngle: 0.25,
            gap: 2
          }
        }
      },
      chartData: {},
      PHOTO_TYPE: {
        PREV_LIVE: 'prevLive',
        TEST_LIVE: 'testLive',
        STSRT_PREV_POWER: 'startPrevPower',
        STSRT_TEST_POWER: 'startTestPower',
        END_PREV_POWER: 'endPrevPower',
        END_TEST_POWER: 'endTestPower'
      }
    }
  },
  watch: {
    currProjectType() {
      this.refreshPowerPrice()
    }
  },
  onShow() {
    const self = this
    self.currLocation = chooseLocation.getLocation()
    if (self.currLocation) {
      console.log(self.currLocation)
      self.address = self.currLocation.address
      self.refreshPowerPrice()
    }
  },
  mounted() {
    if (this.params.id) {
      this.projectId = this.params.id
      this.getReportDetail()
    } else {
      this.setTitle('新增测试项目')
      this.isEdit = true
    }
  },
  methods: {
    setTitle(title) {
      uni.setNavigationBarTitle({
        title
      })
    },
    refreshPowerPrice() {
      const self = this
      console.log('refreshPowerPrice', self.currProjectType, self.currLocation)
      self.getPowerPrice(self.currProjectType, self.currLocation?.province)
        .then((powerPrice) => {
          if (powerPrice) {
            self.powerPrice = powerPrice
          }
        })
    },
    setChartData(saveRate) {
      this.chartOptions.title.name = `${fixedDecimal(saveRate * 100, 1)}%`
      this.chartOptions = JSON.parse(JSON.stringify(this.chartOptions))
      this.chartData = {
        series: [
          {
            name: '节能率',
            color: color.primary,
            data: fixedDecimal(saveRate, 1)
          }
        ]
      }
    },
    getReportDetail() {
      const self = this
      uni.request({
        url: '/report/get',
        data: {
          id: self.projectId
        },
        success(result) {
          if (result.data.success && result.data.data) {
            const projectInfo = result.data.data
            self.isEdit = !projectInfo.report_path
            self.name = projectInfo.name || ''
            self.setTitle(self.name)
            self.desc = projectInfo.description || ''
            self.address = projectInfo.address || ''
            self.place = projectInfo.place || ''
            self.lampCount = Math.floor(projectInfo.total) || ''
            self.currProjectType = parseInt(projectInfo.type)
            self.powerPrice = fixedDecimal(projectInfo.price, 4)
            self.installTime = formatDate(projectInfo.install_time, 'yyyy-MM-dd hh:mm:ss') || ''
            self.prevLampDesc = projectInfo.lightdesc || ''
            self.prevLampType = projectInfo.type0 || ''
            self.prevLampCount = Math.floor(projectInfo.qty0) || ''
            self.currTestLampType = parseInt(projectInfo.type1)
            self.testLampCount = Math.floor(projectInfo.qty1) || ''
            self.testOrgName = projectInfo.company || ''
            self.memo = projectInfo.remark
            self.startTime = formatDate(projectInfo.start_time, 'yyyy-MM-dd hh:mm:ss')
            self.endTime = formatDate(projectInfo.end_time, 'yyyy-MM-dd hh:mm:ss')
            if (projectInfo.records) {
              try {
                const records = JSON.parse(projectInfo.records)
                self.startPrevLampKWH = fixedDecimal(records.startPrevLampKWH, 2) || ''
                self.startTestLampKWH = fixedDecimal(records.startTestLampKWH, 2) || ''
                self.startPrevPowerPath = records.startPrevPowerPath
                self.startTestPowerPath = records.startTestPowerPath
                self.endPrevLampKWH = fixedDecimal(records.endPrevLampKWH, 2) || ''
                self.endTestLampKWH = fixedDecimal(records.endTestLampKWH, 2) || ''
                self.endPrevPowerPath = records.endPrevPowerPath
                self.endTestPowerPath = records.endTestPowerPath
                self.startPrevPowerPic = getImagePath(self.startPrevPowerPath)
                self.startTestPowerPic = getImagePath(self.startTestPowerPath)
                self.endPrevPowerPic = getImagePath(self.endPrevPowerPath)
                self.endTestPowerPic = getImagePath(self.endTestPowerPath)
              } catch (e) {
                console.log(`-----records error-----, ${projectInfo.records}`)
              }
            }
            if (projectInfo.pic) {
              try {
                const pictures = JSON.parse(projectInfo.pic)
                self.prevLiveDesc = pictures.prevLiveDesc || ''
                self.testLiveDesc = pictures.testLiveDesc || ''
                self.prevLivePath = pictures.prevLivePath
                self.testLivePath = pictures.testLivePath
                self.prevLivePic = getImagePath(self.prevLivePath)
                self.testLivePic = getImagePath(self.testLivePath)
              } catch (e) {
                console.log(`-----pic error-----, ${projectInfo.pic}`)
              }
            }
            if (self.checkCompleted()) {
              self.calcResult()
            }
          }
        }
      })
    },
    chooseProjectAddr() {
      const self = this
      if (!self.isEdit) {
        return
      }
      const key = CONFIG.MAP_KEY
      const referer = CONFIG.PROJECT_NAME
      wx.navigateTo({
        url: 'plugin://chooseLocation/index?key=' + key + '&referer=' + referer
      })
    },
    updateMemo(e) {
      this.memo = e.detail.value
    },
    chooseFile(type) {
      const self = this
      if (!self.isEdit) {
        return
      }
      uni.chooseImage({
        count: 1,
        success(result) {
          console.log('choose file', result)
          const tempPath = result.tempFilePaths[0] || ''
          self.uploadFile(tempPath, path => {
            self[`${type}Path`] = path
            self[`${type}Pic`] = getImagePath(path)
          })
        }
      })
    },
    clearFile(type) {
      const self = this
      self[`${type}Path`] = ''
      self[`${type}Pic`] = ''
    },
    uploadFile(filePath, callback) {
      const self = this
      uni.uploadFile({
        url: '/sys/upload',
        filePath,
        name: 'file',
        success(result) {
          if (result.data.url) {
            if (callback instanceof Function) {
              callback(result.data.url)
            }
          }
        }
      })
    },
    previewImg(type) {
      const self = this
      uni.previewImage({
        urls: [self[`${type}Pic`]]
      })
    },
    validParam() {
      const self = this
      const dayTime = 86400000
      const startTimeObj = new Date(self.startTime)
      const endTimeObj = new Date(self.endTime)
      const timeDiff = endTimeObj.getTime() - startTimeObj.getTime()
      if (timeDiff < 0 || startTimeObj.getDate() === endTimeObj.getDate() && timeDiff < dayTime) {
        self.endTime = ''
        uni.showToast({
          title: '结束时间必须晚于开始时间且不能为同一天',
          icon: 'none',
          duration: 5000
        })
        return false
      }
      return true
    },
    saveReport() {
      const self = this
      if (!self.validParam()) {
        return
      }
      const reports = {
        startPrevLampKWH: self.startPrevLampKWH,
        startTestLampKWH: self.startTestLampKWH,
        startPrevPowerPath: self.startPrevPowerPath,
        startTestPowerPath: self.startTestPowerPath,
        endPrevLampKWH: self.endPrevLampKWH,
        endTestLampKWH: self.endTestLampKWH,
        endPrevPowerPath: self.endPrevPowerPath,
        endTestPowerPath: self.endTestPowerPath
      }
      const pictures = {
        prevLiveDesc: self.prevLiveDesc,
        testLiveDesc: self.testLiveDesc,
        prevLivePath: self.prevLivePath,
        testLivePath: self.testLivePath
      }
      const data = {
        name: self.name,
        description: self.desc,
        address: self.address,
        place: self.place,
        total: self.lampCount || 0,
        type: self.currProjectType,
        price: fixedDecimal(self.powerPrice, 4),
        install_time: self.installTime,
        company: self.testOrgName,
        lightdesc: self.prevLampDesc,
        type0: self.prevLampType,
        qty0: self.prevLampCount || 0,
        type1: self.currTestLampType,
        qty1: self.testLampCount || 0,
        remark: self.memo,
        start_time: self.startTime,
        end_time: self.endTime,
        records: JSON.stringify(reports),
        pic: JSON.stringify(pictures)
      }
      let url = '/report/add'
      if (self.projectId) {
        url = '/report/modify'
        data.id = self.projectId
      }
      uni.request({
        url,
        method: 'POST',
        data,
        success(result) {
          if (result.data.success) {
            uni.showToast({
              title: '保存成功',
              icon: 'none',
              duration: 2000
            })
            if (self.checkCompleted()) {
              self.calcResult()
            }
          }
        }
      })
    },
    checkCompleted() {
      const self = this
      const priceCompleted = !!self.powerPrice
      const timeCompleted = self.startTime && self.endTime && getDateDiff(self.startTime, self.endTime)
      const countCompleted = self.prevLampCount && self.testLampCount
      const recordCompleted =
        self.startPrevLampKWH &&
        self.endPrevLampKWH &&
        self.startTestLampKWH &&
        self.endPrevLampKWH &&
        self.endPrevLampKWH > self.startPrevLampKWH &&
        self.endTestLampKWH > self.startTestLampKWH
      console.log(`priceCompleted: ${priceCompleted}, timeCompleted: ${timeCompleted}, countCompleted: ${countCompleted}, recordCompleted: ${recordCompleted}`)
      return priceCompleted && timeCompleted && countCompleted && recordCompleted
    },
    calcResult() {
      const self = this
      self.isShowResult = true
      const dateDiff = getDateDiff(self.startTime, self.endTime)
      self.testDuration = `${dateDiff}天`
      self.prevLampKWH = fixedDecimal(self.endPrevLampKWH - self.startPrevLampKWH, 2)
      self.testLampKWH = fixedDecimal(self.endTestLampKWH - self.startTestLampKWH, 2)
      const singlePrevPower = fixedDecimal((self.prevLampKWH / self.prevLampCount / dateDiff / 24) * 1000, 8)
      const singleTestPower = fixedDecimal((self.testLampKWH / self.testLampCount / dateDiff / 24) * 1000, 8)
      self.annualSavingPower = getAnnualNumber((singlePrevPower - singleTestPower) / 1000)
      self.annualSingleSavingMoney = fixedDecimal(self.annualSavingPower * self.powerPrice, 1)
      self.annualTotalSavingMoney = fixedDecimal(self.annualSingleSavingMoney * self.lampCount, 1)
      self.savingRate = fixedDecimal((singlePrevPower - singleTestPower) / singlePrevPower, 1)
      self.setChartData(self.savingRate)
    },
    deleteProject() {
      this.$refs.deleteProjectDialog.open()
    },
    doDelete() {
      const self = this
      if (!self.projectId) {
        return
      }
      uni.request({
        url: '/report/del',
        method: 'POST',
        data: {
          id: self.projectId
        },
        success(result) {
          self.goBack()
        }
      })
    },
    goBack() {
      uni.navigateBack();
    }
  }
}
</script>

<style lang="scss" scoped>
.test-report {
  padding: 30rpx 30rpx 60rpx;
  background: $primary;
  min-height: 100vh;
}
.section-title {
  @include section-title;
  display: flex;
  justify-content: space-between;
  &.power {
    margin-top: 60rpx;
  }
  .title {
    color: $primary;
  }
}
.report-content {
  background-color: $white;
  border-radius: 10rpx;
  padding: 30rpx 30rpx 70rpx;
  .btn-box {
    justify-content: center;
  }
}
.item-name {
  font-size: $font-size-3;
  font-weight: bold;
}
.item-content {
  font-size: $font-size-2;
  display: flex;
  align-items: center;
  text-align: right;
  width: 360rpx;
  input,
  .input {
    flex: 1;
  }
  /deep/ {
    .uni-date-x,
    .uni-select__input-placeholder {
      font-size: $font-size-2;
    }
  }
  .suffix-icon {
    flex: none;
    width: 44rpx;
    &.location {
      color: $success;
    }
  }
  .suffix-unit {
    flex: none;
    width: 44rpx;
    &.power {
      width: 72rpx;
    }
  }
}
.form-item {
  padding: 32rpx 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 2rpx solid $border-base;
}
.memo-box {
  margin-top: 30rpx;
  .memo-content {
    margin-top: 20rpx;
    border-radius: 10rpx;
    background-color: $background-base;
    border: 2rpx solid $border-light;
    padding: 12rpx 20rpx;
    textarea {
      min-height: 160rpx;
      font-size: $font-size-2;
    }
  }
}
.record-box {
  margin-top: 50rpx;
  .record-item {
    border: 2rpx solid $border-base;
    border-radius: 10rpx;
    padding: 30rpx 20rpx 20rpx;
    margin-top: 40rpx;
    &:first-child {
      margin-top: 0;
    }
    .time-box {
      padding-bottom: 30rpx;
      border-bottom: 2rpx solid $border-base;
      display: flex;
      align-items: center;
      justify-content: space-between;
    }
    .picture-box {
      display: flex;
      justify-content: space-between;
      .type-item {
        padding: 20rpx;
        text-align: center;
        .picture-item {
          margin-top: 30rpx;
          &:first-child {
            margin-top: 0;
          }
          .picture-name {
            color: $text-base;
            font-size: $font-size-1;
          }
          .picture-value {
            margin: 20rpx auto 0;
            width: 200rpx;
            display: flex;
            align-items: center;
            .picture-value-unit {
              margin-left: 4rpx;
              font-size: $font-size-3;
            }
          }
          .file-box {
            margin-top: 20rpx;
            display: flex;
            justify-content: center;
            .add-file {
              display: flex;
              align-items: center;
              justify-content: center;
              width: 200rpx;
              height: 200rpx;
              border: 2rpx solid $border-light;
              border-radius: 10rpx;
              font-size: 48rpx;
              color: $text-secondary;
            }
            .file-preview-box {
              position: relative;
              .file-preview {
                width: 200rpx;
                height: 200rpx;
              }
              .delete-file {
                position: absolute;
                width: 40rpx;
                height: 40rpx;
                line-height: 40rpx;
                text-align: center;
                top: 0;
                right: 0;
                color: $white;
                background-color: $danger;
                font-size: $font-size-4;
                &:after {
                  content: '';
                  display: block;
                  position: absolute;
                  left: -10rpx;
                  right: -10rpx;
                  top: -10rpx;
                  bottom: -10rpx;
                }
              }
            }
          }
        }
      }
    }
  }
}
.split-symbol {
  position: absolute;
  left: 0;
  right: 0;
  margin-top: -30rpx;
  padding: 0 70rpx;
  display: flex;
  justify-content: space-between;
  .split-item {
    .split-dot {
      width: 16rpx;
      height: 16rpx;
      border-radius: 50%;
      background-color: $primary;
    }
    .split-line {
      margin: 0 auto;
      height: 48rpx;
      width: 4rpx;
      background-color: $primary-light;
    }
  }
}
.report-result {
  margin-top: 20rpx;
  background-color: $white;
  border-radius: 10rpx;
  padding: 50rpx 30rpx;
  .chart-box {
    position: relative;
    .info-text {
      font-size: $font-size-2;
      display: flex;
      align-items: center;
      justify-content: center;
      .info-title {
        color: $text-secondary;
      }
    }
  }
  .result-box {
    margin-top: 10rpx;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    .result-item {
      margin-top: 20rpx;
      width: 300rpx;
      padding: 26rpx 20rpx 20rpx;
      border-radius: 10rpx;
      background-color: $background-base;
      &:nth-child(1) .result-title {
        &:before {
          background-color: #6c51f5;
        }
      }
      &:nth-child(2) .result-title {
        &:before {
          background-color: #ce66ff;
        }
      }
      &:nth-child(3) .result-title {
        &:before {
          background-color: #f6c736;
        }
      }
      &:nth-child(4) .result-title {
        &:before {
          background-color: #ff3b3b;
        }
      }
      .result-title {
        position: relative;
        display: flex;
        align-items: center;
        padding-left: 16rpx;
        font-size: $font-size-1;
        color: $text-base;
        &:before {
          position: absolute;
          left: 0;
          display: block;
          content: ' ';
          width: 6rpx;
          height: 22rpx;
          border-radius: 3rpx;
        }
      }
      .result-value {
        margin-top: 6rpx;
        display: flex;
        align-items: baseline;
        font-size: $font-size-1;
        .value {
          font-size: $font-size-5;
          font-weight: bold;
        }
      }
    }
  }
}

.btn-box {
  margin-top: 50rpx;
  display: flex;
  align-items: center;
  justify-content: space-between;
  .btn-item {
    border-radius: 10rpx;
    width: 300rpx;
    height: 80rpx;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: $font-size-2;
    color: $white;
    font-weight: bold;
    &.primary {
      background-color: $primary;
    }
    &.success {
      background-color: $success;
    }
  }
}
.delete-project {
  margin-top: 50rpx;
  border-radius: 10rpx;
  width: 100%;
  height: 80rpx;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: $font-size-2;
  color: $white;
  font-weight: bold;
  background-color: $danger;
}
</style>
